<template>
	<view class="showpage">
		<!--
		<u-navbar bgColor='#4871C0' :titleStyle="{ color: '#FFF'}" title="会议配置" leftIconColor="#FFF"
			@rightClick="rightClick" :autoBack="true">
		</u-navbar>
		-->

		<div class="container">
			<div class="check_time">设置签到时间</div>
			<div class="time_slot">
				<u-cell title="正常时间段" isLink>
					<text slot="value" class="u-slot-value" @click="openTime(1)">
						<span>{{form.normal_time[0]|| '00:00'}}</span> - <span>{{form.normal_time[1] || '00:00'}}</span>
					</text>
				</u-cell>
				<u-cell title="迟到时间段" isLink>
					<text slot="value" class="u-slot-value" @click="openTime(2)">
						<span>{{form.late_time[0]|| '00:00'}}</span> - <span>{{form.late_time[1] || '00:00'}}</span>
					</text>
				</u-cell>

			</div>
			<div class="check_time">设置提示语</div>
			<div class="time_slot">

				<u-cell title="正常提示语" isLink>
					<text slot="value" class="u-slot-value">
						<u--input placeholder="请输入正常提示语" class='slotvalue' border="surround" v-model="form.normal_tip"
							@change="change"></u--input>
					</text>
				</u-cell>

				<u-cell title="迟到提示语" isLink>
					<text slot="value" class="u-slot-value">
						<u--input placeholder="请输入迟到提示语" class='slotvalue' border="surround" v-model="form.late_tip"
							@change="change"></u--input>
					</text>
				</u-cell>

				<u-cell title="缺勤提示语" isLink>
					<text slot="value" class="u-slot-value">
						<u--input placeholder="请输入签到语" class='slotvalue' border="surround" v-model="form.absence_tip"
							@change="change"></u--input>
					</text>
				</u-cell>

			</div>

			<template>
				<div class="check_time">设置物品签到</div>
				<div class="sign_in mb-50">
					<u-cell title="会议中是否有物品领取" :isLink="true" :value="form.have_goods ==1?'有':'无'" @click="openGoods">
					</u-cell>
					<u--input class='ipt' placeholder="请输入物品名称" border="surround" v-if="form.have_goods ==1 "
						v-model="form.goods_name" @change="change">
					</u--input>
				</div>
			</template>
			<div class="subButton">
				<mt-button size="small" type="primary" @click="saveData">保存</mt-button>
			</div>
		</div>

		<u-popup :show="showGoods" mode="bottom" @close="closeGoods" @open="openGoods" :closeable="true"
			:border-radius="10" close-icon-color="#010101" :mask-close-able="false" close-icon-size="42">
			<view class="content" style="height:60%">
				<!-- <u-icon name="checkbox-mark" color="#4871C0" size="28"></u-icon> -->
				<view class="title">请选择 </view>

				<view @click.stop="selGoods(v)" :class="selectwupin.id==v.id?'meet active':'meet '"
					v-for="(v, i) in goodsTypeList">
					{{v.txt}} <text>
						<img src="@/static/assets/images/dui.png" v-if="selectwupin.id==v.id" /></text>
				</view>

				<view class="btn">
					<u-button class='cancelbtn' @click="closeGoods">取消</u-button>
					<u-button type="primary" text="确定" @click="sureGoods" color='#4871C0'></u-button>
				</view>
			</view>
		</u-popup>


		<u-popup :show="showTime" mode="bottom" @close="closeTime" @open="openTime" :closeable="true"
			:border-radius="10" close-icon-color="#010101" :mask-close-able="false" close-icon-size="42">
			<view class="content" style="height:60%">
				<view>
					<picker-view :value="seledTime" :indicator-style="indicatorStyle" @change="bindChange"
						class="picker-view">
						<picker-view-column>
							<view class="item" v-for="(item,index) in hour" :key="index">{{index}}时</view>
						</picker-view-column>

						<picker-view-column>
							<view class="item" v-for="(item,index) in minute" :key="index">{{index}}分</view>
						</picker-view-column>
						<picker-view-column>
							<view class="item">--</view>
						</picker-view-column>
						<picker-view-column>
							<view class="item" v-for="(item,index) in hour" :key="index">{{index}}时</view>
						</picker-view-column>

						<picker-view-column>
							<view class="item" v-for="(item,index) in minute" :key="index">{{index}}分</view>
						</picker-view-column>
					</picker-view>
				</view>



				<view class="btn">
					<u-button class='cancelbtn' @click="closeTime">取消</u-button>
					<u-button type="primary" text="确定" @click="sureTime" color='#4871C0'></u-button>
				</view>
			</view>
		</u-popup>

		<picker ref="picktime1" mode="time" :value="time" @change="bindDateChange">
		</picker>
	</view>
</template>

<script>
	import Swiper from "@/static/assets/js/swiper.min.js";
	export default {
		data() {

			return {
				info: {},
				form: {
					normal_time: [],
					late_time: [],
				},
				hour: 24,
				minute: 60,
				indicatorStyle: `height: ${Math.round(uni.getSystemInfoSync().screenWidth/(750/100))}px;`,
				seledTime: [5, 6, 0, 6, 5],
				dataTime: ['请选择', '第一会议室', '第二会议室', '第三会议室', '第四会议室'],
				index: 0,
				signInData: ['请选择', '签到1', '签到2'],
				signIndex: 0,
				normalPromptData: ['请选择', '您真棒'],
				latePromptData: ['请选择', '加油呀'],
				lateIndex: 0,
				normalIndex: 0,
				goodsData: ['有', '无'],
				showGoods: false,
				showTime: false,
				goodsTypeList: [],
				have_goods: 0,
				time: '',
				timeIndex: 1,
				selectwupin: {}
			};
		},
		onLoad(options) {
			this.ext_data = JSON.parse(JSON.parse(options.query).huiyiData)
			console.log("=======options", JSON.parse(JSON.parse(options.query).huiyiData))
		},
		onShow() {
			var def_data = uni.getStorageSync('def_data');
			this.info = def_data.info;
			this.form = def_data.tip;
			this.goodsTypeList = def_data.have_goods;
			if (this.form.have_goods === undefined) {
				this.form.have_goods = 0;
				this.form.have_goods_str = "无";
			}
			console.log("====this.form1", this.form, String(this.form.have_goods), !String(this.form.have_goods))
			/* if(this.info.type == 3){
				 this.form.have_goods = 1;
			} else{
				this.form.have_goods = 0;
			} */
   
			var now = new Date(Number(new Date(uni.getStorageSync('start_time'))) - 30 * 60 * 1000);
			var now2 = new Date(Number(new Date(uni.getStorageSync('start_time'))));
			if(Array.isArray(this.ext_data.normal_time)){
				this.form.normal_time=this.ext_data.normal_time
			}else{
				this.form.normal_time=this.ext_data.normal_time.split('-')
			}
			if(Array.isArray(this.ext_data.late_time)){
				this.form.late_time=this.ext_data.late_time
			}else{
				this.form.late_time=this.ext_data.late_time.split('-')
			}
			// var now3 = new Date(Number(new Date(uni.getStorageSync('start_time'))));
			// var now4 = new Date(Number(new Date(uni.getStorageSync('start_time'))) + 15 * 60 * 1000);
			
			// this.form.normal_time = [(now.getHours() < 10 ? "0" + now.getHours() : now.getHours()) + ":" + (now
			// .getMinutes() < 10 ? "0" + now.getMinutes() : now.getMinutes()), (now2.getHours() < 10 ? "0" + now2
			// 	.getHours() : now2.getHours()) + ":" + (now2.getMinutes() < 10 ? "0" + now2.getMinutes() : now2
			// 	.getMinutes())];
			// this.form.late_time = [(now3.getHours() < 10 ? "0" + now3.getHours() : now3.getHours()) + ":" + (now3
			// 	.getMinutes() < 10 ? "0" + now3.getMinutes() : now3.getMinutes()), (now4.getHours() < 10 ? "0" +
			// 	now4.getHours() : now4.getHours()) + ":" + (now4.getMinutes() < 10 ? "0" + now4.getMinutes() : now4
			// 	.getMinutes())];

			this.seledTime[0] = now.getHours();
			this.seledTime[1] = now.getMinutes();
			this.seledTime[3] = now2.getHours();
			this.seledTime[4] = now2.getMinutes();
			if (this.ext_data.late_time != undefined) {
				this.form = this.ext_data;
				this.selectwupin = {
					id: this.form.have_goods,
					txt: this.form.have_goods == '1' ? '有' : '无'
				}
			} else {

			}

		},
		computed: {

		},
		updated: function() {

		},
		methods: {
			bindChange: function(e) {
				const val = e.detail.value;
				console.log(val[0], val[1], val[3], val[4]);
				this.seledTime = val;
			},
			sureTime(e) {
				var val = this.seledTime;
				var ti = [(val[0] < 10 ? "0" + val[0] : val[0]) + ":" + (val[1] < 10 ? "0" + val[1] : val[1]), (val[3] <
					10 ? "0" + val[3] : val[3]) + ":" + (val[4] < 10 ? "0" + val[4] : val[4])];
				if (this.timeIndex == 1) {
					this.form.normal_time = ti;
				} else {
					this.form.late_time = ti;
				}
				this.showTime = false;
			},
			openTime(id) {

				var now = new Date(Number(new Date(uni.getStorageSync('start_time'))) - 30 * 60 * 1000);
				var now2 = new Date(Number(new Date(uni.getStorageSync('start_time'))));
				var now3 = new Date(Number(new Date(uni.getStorageSync('start_time'))));
				var now4 = new Date(Number(new Date(uni.getStorageSync('start_time'))) + 15 * 60 * 1000);

				if (id != undefined) this.timeIndex = id;
				if (this.timeIndex == 1) {
					this.seledTime[0] = now.getHours();
					this.seledTime[1] = now.getMinutes();
					this.seledTime[3] = now2.getHours();
					this.seledTime[4] = now2.getMinutes();
				} else {
					this.seledTime[0] = now3.getHours();
					this.seledTime[1] = now3.getMinutes();
					this.seledTime[3] = now4.getHours();
					this.seledTime[4] = now4.getMinutes();
				}

				this.showTime = true;
			},
			closeTime() {
				this.showTime = false;
			},
			callPicker(id) {
				this.timeIndex = id;
				this.$refs.picktime1.$el.click();
			},
			bindDateChange: function(e) {
				if (this.timeIndex == 1) {
					this.$set(this.form.normal_time, 0, e.detail.value);
				} else if (this.timeIndex == 2) {
					this.$set(this.form.normal_time, 1, e.detail.value);
				} else if (this.timeIndex == 3) {
					this.$set(this.form.late_time, 0, e.detail.value);
				} else if (this.timeIndex == 4) {
					this.$set(this.form.late_time, 1, e.detail.value);
				}
			},
			openGoods() {
				this.showGoods = true;
				this.selectwupin.txt = this.form.have_goods_str;
				this.selectwupin.id = this.form.have_goods;
			},
			closeGoods() {
				this.showGoods = false;
				this.selectwupin = {}
			},
			sureGoods() {
				this.showGoods = false;
				let selectwupin = JSON.parse(JSON.stringify(this.selectwupin))
				this.form.have_goods_str = selectwupin.txt;
				this.form.have_goods = selectwupin.id;
				this.selectwupin = {}
				console.log("=========this.form", this.form)
			},
			selGoods(item) {
				this.selectwupin = item
			},
			saveData() {
				// if(this.info.type == 3){
				// 	this.form.have_goods = 1;
				// } else{
				// 	this.form.have_goods = 0;
				// }
				console.log("==========this.info.type", this.info.type, this.form)
				uni.setStorageSync('ext_data', this.form);
				uni.navigateBack();
			},
		},
	};
</script>

<style lang="scss">
	@import "@/static/assets/css/index.css";
	@import "@/static/assets/css/mobiscroll.core-2.5.2.css";
	@import "@/static/assets/css/mobiscroll.animation-2.5.2.css";
	@import "@/static/assets/css/mobiscroll.android-ics-2.5.2.css";


	.container {
		width: 100%;
		background-color: #fff;
		position: relative;
		margin-top: 45px;
		padding-bottom: 85px;

		/deep/ .slotvalue .uni-input-placeholder,
		/deep/ .slotvalue .uni-input-input {
			text-align: right;
		}

		.mb-50 {
			margin-bottom: 50px;
		}

		.check_time {
			width: 100%;
			height: 36px;
			line-height: 36px;
			font-size: 12px;
			color: #999;
			padding: 0 15px;
			background-color: #f8f8f8;
			box-sizing: border-box;
		}

		.time_slot {
			width: 100%;
			background-color: #fff;
		}


		.sign_in_goods .uni-list {
			width: 96%;
			height: 45px;
			height: 54px;
			background-color: #f8f8f8;
		}

		.ipt {
			width: 92%;
			margin-left: 4%;
			background: #F8F8F8;
			height: 40px;
			margin-top: 12px;
			box-sizing: border-box;
		}

		.placeholder {
			color: #666;
			padding-left: 10px;
		}

		.subButton {
			width: 92%;
			height: 40px;
			margin: 0 auto;
			border-radius: 4px 4px 4px 4px;
			opacity: 1;
			position: fixed;
			bottom: 76px;
			left: 4%;

			.mint-button--small {
				width: 100%;
				height: 40px;
				background: #4871C0;
			}
		}

	}

	.picker-view {
		width: 750rpx;
		height: 600rpx;
		margin-top: 20rpx;
	}

	.item {
		height: 50px;
		align-items: center;
		justify-content: center;
		text-align: center;
	}
</style>
